<template>
  <div class="sidebar-menu">
    <div class="menu-header">
      <h3>{ title }</h3>
    </div>
    <ul class="menu-list">
      <sidebar-menu-item
        v-for="item in menuItems"
        :key="item.id"
        :item="item"
        @menu-click="handleMenuClick"
      />
    </ul>
  </div>
</template>

<script>
import SidebarMenuItem from './SidebarMenuItem.vue'

export default {
  name: 'SidebarMenu',
  components: {
    SidebarMenuItem
  },
  props: {
    title: {
      type: String,
      default: '菜单'
    }
  },
  data() {
    return {
      menuItems: [
      {
            "id": "dashboard",
            "title": "工作台",
            "icon": "dashboard",
            "path": "/dashboard",
            "children": [
                  {
                        "id": "overview",
                        "title": "数据概览",
                        "icon": "pie-chart",
                        "path": "/dashboard/overview"
                  },
                  {
                        "id": "realtime",
                        "title": "实时监控",
                        "icon": "monitor",
                        "path": "/dashboard/realtime"
                  }
            ]
      },
      {
            "id": "data",
            "title": "数据管理",
            "icon": "database",
            "path": "/data",
            "children": [
                  {
                        "id": "import",
                        "title": "数据导入",
                        "icon": "upload",
                        "path": "/data/import"
                  },
                  {
                        "id": "sources",
                        "title": "数据源管理",
                        "icon": "server",
                        "path": "/data/sources"
                  },
                  {
                        "id": "processing",
                        "title": "数据处理",
                        "icon": "settings",
                        "path": "/data/processing"
                  }
            ]
      },
      {
            "id": "analysis",
            "title": "数据分析",
            "icon": "line-chart",
            "path": "/analysis",
            "children": [
                  {
                        "id": "exploratory",
                        "title": "探索分析",
                        "icon": "search",
                        "path": "/analysis/exploratory"
                  },
                  {
                        "id": "advanced",
                        "title": "高级分析",
                        "icon": "bar-chart",
                        "path": "/analysis/advanced"
                  }
            ]
      },
      {
            "id": "reports",
            "title": "报表中心",
            "icon": "file-text",
            "path": "/reports",
            "children": [
                  {
                        "id": "templates",
                        "title": "报表模板",
                        "icon": "layout",
                        "path": "/reports/templates"
                  },
                  {
                        "id": "generation",
                        "title": "报表生成",
                        "icon": "printer",
                        "path": "/reports/generation"
                  },
                  {
                        "id": "history",
                        "title": "历史报表",
                        "icon": "archive",
                        "path": "/reports/history"
                  }
            ]
      },
      {
            "id": "alerts",
            "title": "告警中心",
            "icon": "bell",
            "path": "/alerts",
            "children": [
                  {
                        "id": "rules",
                        "title": "告警规则",
                        "icon": "alert-triangle",
                        "path": "/alerts/rules"
                  },
                  {
                        "id": "history",
                        "title": "告警历史",
                        "icon": "clock",
                        "path": "/alerts/history"
                  },
                  {
                        "id": "settings",
                        "title": "通知设置",
                        "icon": "mail",
                        "path": "/alerts/settings"
                  }
            ]
      }
]
    }
  },
  methods: {
    handleMenuClick(item) {
      this.$emit('menu-click', item)
      if (item.path) {
        this.$router.push(item.path)
      }
    }
  }
}
</script>

<style scoped>
.sidebar-menu {
  width: 240px;
  height: 100%;
  background: #fff;
  border-right: 1px solid #e8e8e8;
  overflow-y: auto;
}

.menu-header {
  padding: 16px;
  border-bottom: 1px solid #e8e8e8;
}

.menu-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.menu-list {
  list-style: none;
  margin: 0;
  padding: 8px 0;
}
</style>